<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:p="http://xmlns.jcp.org/jsf/passthrough"
      xmlns:myta="http://java.sun.com/jsf/composite/myta">

	<ui:composition template="/templates/form.xhtml">
			<ui:define name="title">SIA Online</ui:define>
			<ui:define name="header">Data Kelas Siswa</ui:define>
			<ui:define name="body">
				<h:form id="form" onkeypress="if(event.keyCode==13)return false;">
					<ui:include src="/templates/message.xhtml" />
					
					<div class="panel panel-primary">
						<div class="panel-heading">Data Kelas Siswa</div>
						<div class="panel-body">
							<div class="form-horizontal">
								<myta:inputText id="id" label="ID Kelas Siswa" inputBinding="#{kelasSiswaData.txtid}"/>
								<myta:comboBox id="kelas" label="Kelas" comboboxBinding="#{kelasSiswaData.txtidkelas}" comboboxValue="#{kelasSiswaData.listKelas}"/>
							</div>
						</div>
					</div>
					
					<div class="panel panel-primary">
						<div class="panel-heading">Detail Kelas Siswa</div>
						<div class="panel-body">
							<div class="form-horizontal">
								<myta:comboBox id="nis" label="Nama Siswa" comboboxBinding="#{kelasSiswaData.txtnis}" comboboxValue="#{kelasSiswaData.listNis}"/>
							</div>
							<div class="pull-right">
								<h:commandButton id="tambah" value="Tambah Siswa" action="#{kelasSiswaData.tambahSiswa()}" styleClass="btn btn-success">
									<f:ajax execute=":form:nis :form:tambah" render=":form:datatable :form:message"/>
								</h:commandButton>
							</div>
						</div>
					</div>
					
					<div class="panel panel-primary">
						<div class="panel-heading">Table Detail Kelas Siswa</div>
						<div class="panel-body">
							<h:dataTable id="datatable" binding="#{kelasSiswaData.htmldatatable}" value="#{sessionBean.tableDetailSiswaKelas.dataRows}" var="var" styleClass="table table-bordered table-striped datatable">
								<h:column>
									<f:facet name="header">NIS</f:facet>
									#{var[0]}
								</h:column>
								<h:column>
									<f:facet name="header">Nama Siswa</f:facet>
									#{var[1]}
								</h:column>
								<h:column>
									<f:facet name="header">Action</f:facet>
									<h:commandButton id="btnhapus" action="#{kelasSiswaData.hapusSiswa()}" value="Hapus Detail" styleClass="btn btn-sm btn-danger">
										<f:ajax execute=":form:btnhapus" render="form:datatable :form:message"/>
									</h:commandButton>
								</h:column>
							</h:dataTable>
						</div>
					</div>
					
					<div class="pull-right">
						<h:commandButton value="Simpan" action="#{kelasSiswaData.save}" styleClass="btn btn-success">
						</h:commandButton>&nbsp;
						<h:commandButton value="Batal" action="#{kelasSiswaData.cancel}" styleClass="btn btn-info">
						</h:commandButton>
					</div>
				</h:form>
			</ui:define>
	</ui:composition>
</html>